<template>
	<view class="padding">
		<view class="top">
			<image src="/static/images/visa.png" mode="" class="visa"></image>
			<view class="title">签约商家</view>
			<view class="address">{{info.shop.abbr}}</view>
			<image src="/static/images/certification.png" mode="" class="certification"></image>
		</view>
		<view class="license">
			<view class="title">
				营业执照
			</view>
			<view class="img">
				<!-- <image src="/static/images/license.png" mode="" class="img1"></image> -->
				<image :src="info.shop.business_license" mode="" class="img2"></image>
			</view>
		</view>
		<view class="license">
			<view class="title">
				技师职业资格证书
			</view>
			<view class="img">
				<!-- <image src="/static/images/license.png" mode="" class="img1"></image> -->
				<image v-if="info.cert" :src="info.cert[0]" mode="" class="img2"></image>
			</view>
		</view>
	</view>
</template>

<script> 
	export default{
		data(){
			return{
				info:{},
			}
		},
		onLoad(options) {
			console.log(JSON.parse(options.data))
			if(options.data){
				this.info = JSON.parse(options.data)
			}
		},
		methods:{
		}
	}
</script>

<style lang="scss" scoped>
	.padding{
		margin: 3% 15px;
		.top{
			display: flex;
			align-items: center;
			.visa{
				width: 13px;
				height: 13px;
				margin-right: 3px;
			}
			.title{
				font-size: 18px;
				color: rgb(51, 51, 51);
				font-weight: 600;
			}
			.address{
				font-size: 13px;
				color: rgb(51, 51, 51);
				margin-left: 8px;
			}
			.certification{
				width: 46px;
				height: 15px;
				margin-left: 3px;
			}
		}
		.license{
			margin-top: 20px;
			.title{
				font-size: 18px;
				color: rgb(51, 51, 51);
				font-weight: 600;
			}
			.img{
				width: 260px;
				height: 156px;
				background: #fff;
				opacity: 1;
				border-radius: 13px;
				position: relative;
				margin-top: 10px;
				image{
					position: absolute;
					left: 0;
					width: 240px;
					height: 136px;
					border-radius: 13px;
					margin: 10px;
				}
				.img1{
					z-index: 1;
				}
				
			}
		}
	}
</style>